<template>
  <div>
    <!--对话框-->
    <x-dialog
        :dialog-title.sync="dialogTitle"
        :dialog-visible.sync="dialogVisible"
        @dialogConfirm="dialogConfirm"
        @closeDialog="closeDialog"
        @openDialog="openDialog"
    >
      <!--配合表单使用-->
      <x-form
          ref="xForm"
          :label-width="'80px'"
          :form="form"
          :rules="rules"
          :formItemConfig="formConfig"
          :marginBottom="'20px'"
      >
      </x-form>
    </x-dialog>
  </div>
</template>

<script>
export default {
  name: "XDialog",
  data() {
    return {
      // 对话框相关
      dialogTitle: '',
      dialogVisible: false,
      // 表单相关
      form: {},
      rules: {},
      formConfig: [
        {
          label: "账号",
          inputType: "text",
          prop: "zh",
          type: "input",
          placeholder: "请输入账号",
          rule: true,
        },
        {
          type: "select",
          prop: 'gjz',
          lableWidth: "60",
          width: 180,
          placeholder: "请输入ID/名称",
          options:[]
        },
      ]
    }
  },
  methods: {
    dialogConfirm() {
      console.log('dialogConfirm')
    },
    closeDialog() {
      console.log('closeDialog')

    },
    openDialog() {
      console.log('openDialog 重置表格')
      this.$refs.xForm.$refs.xFrom.resetFields()
    }
  }
}
</script>

<style scoped>

</style>
